<template>
  <div class="add-car">
    <el-dialog
        v-el-drag-dialog="{ drag: true, full: false, resize: false }"
        title="员工修改"
        :close-on-click-modal="false"
        :visible.sync="md.state"
        @close="closeMd"
        v-if="md.state"
        width="80%"
        append-to-body
    >

      <!--  基本信息  -->
      <baseFrom ref="baseRef" :source="currentSource" @change="roleSelect" />
      <otherFrom ref="otherRef" :source="currentSource" v-if="sourceData.isDriver === 0"/>
      <driverFrom ref="driverRef" :source="currentSource" v-if="sourceData.isDriver === 1"></driverFrom>

      <el-row style="padding: 20px 20px 20px 40px">
        <el-button type="primary" @click="onSubmit" :disabled="fm.sb.load">{{ fm.sb.text }}</el-button>
        <!-- <el-button @click="resetForm">重置</el-button> -->
      </el-row>

    </el-dialog>
  </div>
</template>

<script>
import {mapGetters} from "vuex";
import {updateStaff, getStaffById} from "@/api/services/personMan.service";
import elDragDialog from "@/directive/el-drag-dialog";
import UploadImg from "@/components/UploadImg";
import TpAmap from "@/views/tpls/tp-amap";
import baseFrom from "./baseFrom";
import otherFrom from './otherFrom'
import driverFrom from './driverFrom'

export default {
  name: "UpdateStaff",
  directives: {elDragDialog},
  props: ["state", 'id'],
  components: {UploadImg, TpAmap, baseFrom, otherFrom, driverFrom},
  computed: {
    ...mapGetters(["lunitNum", "uname"]),
  },
  data() {
    return {
      isShowMap: false,
      currentSource: null,
      md: {state: this.state},
      sourceData: {
        isDriver: 0,
        age: '',
        birthdayTime: '',
      },
      fm: {
        fname: "addCarFm",
        sb: {load: false, text: "立即修改"},
      },
    };
  },
  created() {
    if (this.id) {
      this.getStaffInfo(this.id)
    }
  },
  methods: {
    getStaffInfo(id) {
      getStaffById({id}).then(res => {
        this.currentSource = res.data
        let type = res.data.roleId.name === '驾驶员' ? 1 : 0
        this.$set(this.sourceData, 'isDriver', type)
      })
    },
    closeMd() {
      this.$emit("getMdState", false);
    },
    async onSubmit() {
      const that = this, U = that.U;

      let baseRef = that.$refs.baseRef
      let otherRef = that.$refs.otherRef
      let driverRef = that.$refs.driverRef
      let baseValidate = await baseRef.validate()
      // 校验
      let otherValidate = that.sourceData.isDriver === 0 ? await otherRef.validate() : await driverRef.validate()

      if (!baseValidate || !otherValidate) return

      let baseData = baseRef.getSource()
      let otherData = that.sourceData.isDriver === 0 ? otherRef.getSource() : driverRef.getSource()
      let params = Object.assign({}, that.sourceData, baseData, otherData)
      // let loading = that.U.qloading("提交中，请稍后...");
      updateStaff(params).then(res => {
        // that.U.qclose(loading);
        if(res.code != 1){
          U.qerror(res.msg);
        }else{
          that.closeMd();
          that.$emit("reloadDg");
        }
      }).catch(() => {
        that.U.qclose(loading);
      })

    },
    resetForm() {
      let baseRef = this.$refs.baseRef
      baseRef.resetFields();
      if (this.sourceData.isDriver === 0) {
        let otherRef = this.$refs.otherRef
        otherRef.resetFields();
      } else {
        let driverRef = this.$refs.driverRef
        driverRef.resetFields();
      }
    },
    roleSelect({name}) {
      if(!name) return
      this.sourceData.isDriver = name === "驾驶员" ? 1 : 0
    },
  },
};
</script>
<style lang="less" scoped>
.typeSty {
  padding: 0 20px 0 20px;
  font-weight: 600;
}
</style>